<template>
	<view class="work_report" v-if="reportDetail">
		<view class="work_head flex_row al_center">
			<view class="flex_col flex_1 al_center">
				<view class="flex_col head_item">
					<text>我的工作</text>
					<text>司机</text>
				</view>
			</view>
			<view class="head_line"></view>
			<view class="flex_col flex_1 al_center">
				<view class="flex_col head_item">
					<text>汇报时间</text>
					<text>{{reportTime}}</text>
				</view>
			</view>
		</view>
		<view class="full_width pd_bt_20 pd_tp_30">
			<text class="status_txt">健康状况</text>
		</view>
		<text class="health_status">{{reportDetail.healthStatus}}</text>

		
		<view class="report_list flex_col al_center mg_tp_10">

			<view class="report_item flex_row al_center">
				<text class="report_name form_lable">车牌号</text>
				<text class="flex_1 report_input">{{reportDetail.plateNo}}</text>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name form_lable" :style="{width:'300rpx'}">仪表盘当前公里数</text>
				<text class="flex_1 report_input">{{reportDetail.startMileage}}</text>				
				<text  class="report_value pd_rt_10" :style="{color:'#909090'}">Km</text>
				<!-- <input type="number" v-model="startMileage" class="flex_1 report_input" placeholder="请输入"/> -->
				<!-- item.startKm -->
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">按交规驾驶</text>
				<view class="flex_row al_center">
					<text class="report_value" :style="{color:'#333'}">{{reportDetail.safety.safeDrive}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name form_lable">轮胎气压</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.tirePressure}}</text>
				</view>
				<!-- <text class="flex_1 report_input">{{reportDetail.safety.tirePressure}}</text> -->
				<!-- <text  class="report_value pd_rt_10" :style="{color:'#909090'}">KPA</text> -->
			</view>
			
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">发动机</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.engineState}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">车门</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.carDoorState}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">水箱</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.waterTankState}}</text>
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">机油</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.engineOilState}}</text>
					
				</view>
			</view>
			<view class="report_item flex_row just_space_between al_center">
				<text class="report_name">刹车与制动</text>
				<view class="flex_row al_center">
					<text class="flex_1 report_input">{{reportDetail.safety.brakeStopState}}</text>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	import uniIcons from '@/components/uni-icons/uni-icons.vue'
	import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue'
	export default {
		data() {
			return {
				submitFlag:false,
				engine:-1,
				cardoor:-1,
				waterTank:-1,
				machineOil:-1,
				brake:-1,
				engineOptions:[{text:'正常'},{text:'异常'}],
				cardoorOptions:[{text:'已锁'},{text:'未锁'}],
				healthStatus:'',
				plateNumber:'',
				pressure:'正常'
			}
		},
		computed:{
			reportTime:function(){
				if(this.reportDetail){
					return this.$utils.format(new Date(this.reportDetail.createTime),'yyyy-MM-dd hh:mm')
				}
			}
		},
		props:{
			reportDetail:{
				type:Object,
				default:()=>{
					return {}
				}
			}
		},
		components:{
			uniNavBar,
			uniIcons
		},
		methods: {
			toast(){
				uni.showToast({
					icon:'none',
					title:"不可选择！",
					duration:1000
				})
			},
			changePicker(e,index){
				switch(index){
					case 0:this.engine = e.detail.value;break;
					case 1:this.cardoor = e.detail.value;break;
					case 2:this.waterTank = e.detail.value;break;
					case 3:this.machineOil = e.detail.value;break;
					case 4:this.brake = e.detail.value;break;
				}
				
			},
			back(){
				this.$utils.navBack()
			},
			_isCarNo(value) {
				// 新能源车牌
				const xreg = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}(([0-9]{5}[DF]$)|([DF][A-HJ-NP-Z0-9][0-9]{4}$))/;
				// 旧车牌
				const creg = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳]{1}$/;
				if (value.length === 7) {
					return creg.test(value);
				} else if (value.length === 8) {
					return xreg.test(value);
				} else {
					return false;
				}
			}
		}
	}
</script>

<style scoped>
	@import "@/common/css/main.css";	
page {
	width: 750rpx;
	min-height: 100%;
	background-color: #2B69E7;
	display: flex;
}

.work_report{
	width: 750rpx;
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: center;
	background:#F6F6F6 ;
}
.work_head{
	width:750rpx;
	height:140rpx;
	background:#fff;
}
.head_line{
	width:1px;
	height:44rpx;
	background:#D7D7D7;
}
.head_item text:nth-child(1){
	font-size:30rpx;
	font-weight:500;
	color:#868686;
}
.head_item text:nth-child(2){
	margin-top: 10rpx;
	font-size:34rpx;
	font-weight:bold;
	color:#454545;
}
.status_txt{
	margin-left: 40rpx;
	font-size:32rpx;
	font-weight:500;
	color:#909090;
}
.health_status{
	width: 750rpx;
	height: 80rpx;
	background: #fff;
	padding-left: 40rpx;
	padding-top: 20rpx;
	font-size: 32rpx;
	box-sizing: border-box;
}
.report_item{
	width: 690rpx;
	height: 120rpx;
	border-bottom: 1px solid #E8E8E8;
}
.report_name{
	font-size: 32rpx;
	color: #2E2D2D;
	font-weight: 500;
}
.report_value{
	font-size: 32rpx;
	color: #909090;
	font-weight: 500;
}
.report_list{
	width: 750rpx;
	background-color: #fff;
}
.two_btn{
	width: 750rpx;
	height: 130rpx;
	margin-top: 40rpx;
	text-align: center;
	background-color: #fff;
}
.draft_btn{
	margin-left: 34rpx;
	margin-top: 20rpx;
	width:200rpx;
	height:96rpx;
	background:#26AE6C;
	border-radius:10rpx;
	
}
.draft_btn text{
	font-size:32rpx;
	font-weight:bold;
	color:#fff;
}
.submit_btn{
	width:466rpx;
	height:76rpx;
	background:#345AD4;
	border-radius:10rpx;
	margin: 0 auto;
}
.submit_btn text{
	font-size:32rpx;
	font-weight:bold;
	color:#fff;
}


.form_lable{
	width: 200rpx;
}
.report_input{
	font-size: 32rpx;
}
</style>
